<!-- Tag.vue -->
<template>
    <div class="tag" v-on:click="onChooseClick">
        {{text}}
        <button v-on:click="onCloseClick">×</button>
    </div>
</template>
<script>
    export default {
        name: "tag",
        props: {
            index:Number,
            //标签标示
            tagid:Number,
            // 标签内容
            text: String
        },
        methods: {
            onCloseClick () {
                // 将删除标签事件暴露除去
                this.$emit("delete", this.index,this.tagid,this.text);
            },
            onChooseClick () {
                // 将删除标签事件暴露除去
                this.$emit("choose", this.index,this.tagid,this.text);
            }
        }
    }
</script>
<style type="text/css" scoped>
    .tag {
        display: inline-block;margin: 3px;
    }
</style>